const NODE_COLOR = '#9932CC'
export default function registerCondition(lf) {
  lf.register('condition', ({ PolygonNode, PolygonNodeModel, h }) => {
    class Node extends PolygonNode {
      getIconShape () {
        return h(
          'svg',
          {
            x: 14,
            y: 13,
            width: 23,
            height: 23,
            viewBox: '0 0 1024 1024'
          },
          h(
            'path',
            {
              fill: NODE_COLOR,
              d: 'M832 708.032A128.064 128.064 0 0 1 800 960a128 128 0 0 1-32-251.968V576a32 32 0 0 0-32-32H288a32 32 0 0 0-32 32v132.032A128.064 128.064 0 0 1 224 960a128 128 0 0 1-32-251.968V544a64 64 0 0 1 64-64h224V315.968A128.064 128.064 0 0 1 512 64a128 128 0 0 1 32 251.968V480h224a64 64 0 0 1 64 64v164.032zM512 256a64 64 0 1 0 0-128 64 64 0 0 0 0 128zM224 896a64 64 0 1 0 0-128 64 64 0 0 0 0 128z m576 0a64 64 0 1 0 0-128 64 64 0 0 0 0 128z'
            }
          )
        )
      }
      getShape () {
        const {model} = this.props
        const {width, height, x, y, points} = model
        const {
          fill,
          fillOpacity,
          strokeWidth,
          stroke,
          strokeOpacity,
        } = model.getNodeStyle()
        const transform = `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`
        const pointsPath = points.map(point => point.join(',')).join(' ')
        return h(
          'g',
          {
            transform
          },
          [
            h(
              'polygon',
              {
                points: pointsPath,
                fill,
                stroke,
                strokeWidth,
                strokeOpacity,
                fillOpacity
              }
            ),
            this.getIconShape()
          ]
        )
      }
    }
    class Model extends PolygonNodeModel {
      constructor (data, graphModel) {
        data.text = {
          value: (data.text && data.text.value) || '',
          x: data.x,
          y: data.y + 50
        }
        super(data, graphModel)
        const lenght = 25
        this.points = [
          [lenght, 0],
          [lenght * 2, lenght],
          [lenght, lenght * 2],
          [0, lenght]
        ]
      }
      getNodeStyle() {
        const style = super.getNodeStyle()
        style.stroke = NODE_COLOR
        return style
      }
    }
    return {
      view: Node,
      model: Model
    }
  })
}
